<template>
	<div class="fourPage">
		<div class="explain">
			<p class="exp_title">
				<span>微信售票机用途之四：线下分销</span>
				<i></i>
			</p>
			<div class="explain_cont">
				<i><img src="../../assets/fiveuse/fanstwo01.png"></i>
				<ul>
					<li>
						<p>景区与周边商家<font>签订代理协议</font>后，将微信售票机投放在火车站、周边酒店、村委会等场所，供游客或上架<font>自助购票</font>，然后系统在游客入园后<font>自动分账</font>的应用</p>
						 
						 
					</li>
					<li>
						<p>适用场景：景区周边火车站、农家乐、独家酒店</p>
						<p>等客流集中地点投放</p>
					</li>
				</ul>
			</div>
		</div>
		 <div class="analyze">
		 	<p class="exp_title">
				<span>线下分销优势分析</span>
				<i></i>
			</p>
			<div class="analyze_cont">
				<ul>
					<li v-for="item in analyze_list">
						<i><img :src="item.IMG"></i>
						<p>{{item.title}}</p>
						<p>{{item.text}}</p>
					</li>
				</ul>
			</div>
		 </div>
		<Advance></Advance>
	</div>	
</template>

<script>

import Advance from '../../components/FiveUse/AdvanceOrder'
	export default{
		name:'fourPage',
		components:{
			Advance
		},
		data(){
			return{
				analyze_list:[
					{
						IMG:require('../../assets/fiveuse/fanstwo02.png'),
						title:'掌控价格',
						text:'解决传统的周边代理方式滋生黄牛的弊端'
					},
					{
						IMG:require('../../assets/fiveuse/fanstwo03.png'),
						title:'自动分帐',
						text:'解决多方结算给财物部门带来的麻烦'
					},
					{
						IMG:require('../../assets/fiveuse/fanstwo04.png'),
						title:'强力推广',
						text:'大幅景区在周边生态圈的营影响力——既是“售票员”、又是“广告牌”'
					}
				]
			}
		}
	}
</script>

<style scoped>
@media only screen and (min-width: 1000px){
	.fourPage{
		width: 100%;
		margin-top: 70px;
	 
	}
	.explain{
		width: 1000px;
		margin: 0 auto;
	}
	.exp_title{
		text-align: center;
	}
	.exp_title span{
		font-size:26px;
		color: #4d4845;
		display: block;
	}
	.exp_title i{
		display: inline-block;
		width: 50px;
		height: 2px;
		background-color: #4d4845;
	}
	.explain_cont{
		width: 100%;
		overflow:hidden;
		margin-top:40px;
		margin-bottom: 95px;
	}
	.explain_cont i{
		display: inline-block;
		width:430px;
		height: 430px;
		float: left;
	}
	.explain_cont i img{
		width: 100%;
	}

	.explain_cont ul{
		display: inline-block;
		width: 500px;
		float: left;
	}
	.explain_cont ul li{
		float: left;
		width: 100%;
		text-align: center;
		
	}
	.explain_cont ul li p{
		margin-bottom: 20px;
		line-height: 30px;
	}
	.explain_cont ul li:nth-child(1){
		font-size: 18px;
		color:#4d4845;
		margin-top: 70px;
		 

	}
	.explain_cont ul li:nth-child(1) font{
		font-size: 24px;

	}
	.explain_cont ul li:nth-child(1) p{
		padding:0 40px;
	}
	.explain_cont ul li:nth-child(2){
		font-size: 18px;
		color:#00ade6;
		margin-top: 40px;
		
	}

	.analyze{
		width: 100%;
	}
	.analyze .analyze_cont{
		width: 1000px;
		margin:0 auto;
	}
	.analyze .analyze_cont ul{
		margin-top: 50px;
		margin-bottom: 100px;
		overflow: hidden;
	}
	.analyze .analyze_cont li{
		width: 33%;
		display:inline-block;
		text-align: center;
		float: left;
	}
	.analyze .analyze_cont li i{
		width:100%;
		display: inline-block;
	}

	.analyze .analyze_cont li p{
		padding:0 50px;
		font-size: 14px;
		color: #666;
		margin-top: 20px;
		line-height: 25px;
	}
	.analyze .analyze_cont li p:nth-child(2){
		font-size: 18px;
		color: #4d4845;
	} 




}


</style>